<template>
    <div>
        <!--分页-->
        <el-pagination
            background
            style="text-align: center;margin-top: 20px;"
            layout="prev, pager, next"
            @current-change="handleCurrentChange"
            :current-page="currentPage"
            :page-size="pageSize"
            :total="total">
        </el-pagination>
    </div>
</template>

<script>
    export default {
        name: "pagination",
        data() {
            return {
                currentPage: 1, // 当前页数
                pageSize: 10, // 每页显示条目个数
            }
        },
        props: {
            total: {
                type: Number
            }
        },
        methods: {
            // 分页的改变事件
            handleCurrentChange(val) {
                // console.log(`当前页: ${val}`)
                this.$emit('handleClickPage', val)
            },
        }
    }
</script>

<style scoped lang="scss">

</style>
